/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

var NewsDialog = function(text, id, action){
    // Instance attributes
    this.text = text;
    this.id = id;
    this.action = action;
}

// Shared methods
NewsDialog.prototype = (function(){ 
     
    var CLASS = "newsDialog"; 
    
    // Public API
    return {
        addHandler: function(handler) {
            this.handler = handler;
        },
        
        setParent: function(selector) {
            this.parent = selector;  
        },
           
        render: function() {
            if(! this.parent){ // Should work for null and undefined
                throw "No parent defined";
            }
           
            var html;
            if (this.action === "add") {
                html = this.toAddHtml();
            } else if (this.action === "edit") {
                html = this.toEditHtml();
            }
            // Must render befor attaching listeners (will overwrite)
            $(this.parent).html(html);
            // "this" will be the control inside listener function
            var self = this; 
            
            // Eventhandler
            $(this.parent).find("#add")
            .on('click', function(){
                var newsItem = {};
                newsItem.text = $(self.parent).find("textarea#text").val();
                if(self.handler){
                    self.handler("add", newsItem) // if defined!
                }
                $(self.parent).html("");  
                window.location.reload();
            });
            $(this.parent).find("#edit")  
            .on('click', function(){
                var newsItem = {};
                newsItem.id =  $(self.parent).find("#id").text();
                newsItem.text = $(self.parent).find("textarea#text").val();
                if(self.handler){
                    self.handler("edit", newsItem) // if defined!
                }
                $(self.parent).html("");  
                window.location.reload();
            }); 
            $(this.parent).find("#del")  
            .on('click', function(){
                var newsItem = {};
                newsItem.id =  $(self.parent).find("#id").text();
                newsItem.text = $(self.parent).find("textarea#text").val();
                if(self.handler){
                    self.handler("del", newsItem) // if defined!
                }
                $(self.parent).html("");  
                window.location.reload();
            }); 
            $(this.parent).find("#cancel").click(function(){
                $(self.parent).html("");
            });
        },
        // This is EXTREMLY when using Xhtml every single space, quote, etc must be correct!!!
        toAddHtml : function(){
            var html;
            
            html = "<div class='"+ CLASS + "'>"; 
            
            html += "<form><label id='id' for='id'>" + this.id + "</label><br/>" 
            + "<textarea id='text' name='text' rows='5' cols='50'>" + this.text + "</textarea><br/>"  
            + "<input id='add' type='button' value='Add'/>" 
            + "<input id='cancel' type='button' value='Cancel'/>"
            + "</form></div>";
            return html;
        },
        toEditHtml : function(){
            var html;
            
            html = "<div class='"+ CLASS + "'>"; 
            
            html += "<form><label id='id' for='id'>" + this.id + "</label><br/>" 
            + "<textarea id='text' name='text' rows='5' cols='50'>" + this.text + "</textarea><br/>"  
            + "<input id='edit' type='button' value='Edit'/>" 
            + "<input id='del' type='button' value='Delete'/>" 
            + "<input id='cancel' type='button' value='Cancel'/>"
            + "</form></div>";
            return html;
        }
    }
})();